<!DOCTYPE html>
<html>
	<head>
		<title>Hotel Destination</title>
		
		<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet"></link>
		<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet"></link>
		<link href="css/style.css" rel="stylesheet"></link>
	</head>
	<body>
		<nav id="topnav" class="navbar navbar-default navbar-fixed-top">
			<div class="container">
				<div class="navbar-header">
					<button class="navbar-toggle collapsed" type="button" data-toggle="topnav">
						<span class="sr-only">Toggle navigation</span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
					</button>
					<a class="navbar-brand" href="#">
						<span class="logo-text"><i class="fa fa-home"></i> DESTINATION</span>
					</a>
				</div>
				<div class="navbar-collapse bs-example-js-navbar-scrollspy collapse" aria-expanded="false" style="height: 1px;">
					<ul class="nav navbar-nav">
						<li class=""><a href="#fat">@fat</a></li>
						<li class=""><a href="#mdo">@mdo</a></li>
						<li class="dropdown active">
						<a href="#" id="navbarDrop1" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Dropdown <span class="caret"></span></a>
						<ul class="dropdown-menu" role="menu" aria-labelledby="navbarDrop1">
							<li class="active"><a href="#one" tabindex="-1">one</a></li>
							<li class=""><a href="#two" tabindex="-1">two</a></li>
							<li class="divider"></li>
							<li class=""><a href="#three" tabindex="-1">three</a></li>
						</ul>
						</li>
					</ul>
				</div>
			</div>
		</nav>
		
		<div class="container">
			<div class="banner">
				<div class="logo-outer">
					<img clas="logo" src="images/logo.png"></img>
				</div>
				
				
				<div id="banner-images" class="banner-images carousel slide" data-ride="carousel">
					<ol class="carousel-indicators">
					  <li data-target="#banner-images" data-slide-to="0" class="active"></li>
					  <li data-target="#banner-images" data-slide-to="1"></li>
					  <li data-target="#banner-images" data-slide-to="2"></li>
					</ol>
					
					<div class="carousel-inner" role="listbox">
						<div class="item active">
							<img src="images/banner1.jpg" alt="banner1"></img>
						</div>
						<div class="item">
							<img src="images/banner2.jpg" alt="banner1"></img>
						</div>
					</div>
				</div>
			</div>
			
		</div>
		
		
		<script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
		<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
		<script>
			$('body').scrollspy({ target: '#topnav' })
		</script>
	</body>
</html>